<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:t="http://java.sun.com/jsf/composite/components/comps"
	xmlns:m="http://java.sun.com/jsf/composite/components/modalPesquisa"
	xmlns:p="http://primefaces.prime.com.tr/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
</h:head>
<h:body>
	<style>
.ui-wizard-step-title {
	float: left;
	font-size: 14px;
	margin: 0 3px 0 0;
	padding: 0.3em;
}
</style>
	<h:form id="frmPagina">

		<t:toolbar managedbean="#{clienteHome}" widgetVar="toolBar"></t:toolbar>
		<p:spacer height="30px" width="99%" ></p:spacer>

		<p:wizard widgetVar="wiz" backLabel="Voltar" nextLabel="Avançar"
			showNavBar="#{clienteHome.estadoCadastrando or clienteHome.estadoEditando or clienteHome.estadoSelecionado}"
			flowListener="#{clienteHome.onFlowProcess}">

			<p:tab id="pessoal" title="Dados Pessoais">


				<p:growl></p:growl>

				<h:panelGrid columns="2">
					<h:outputText value="Nome: *" />
					<p:inputText required="true" label="Nome"
						value="#{clienteHome.entidade.nome}"
						disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}" />

					<h:outputText value="Data Nascimento: " />
					<p:calendar value="#{clienteHome.entidade.datNascimento}"
						pattern="dd/MM/yyyy"
						disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}"></p:calendar>

					<h:outputText value="CPF: " />
					<p:inputMask mask="999.999.999-99" 
						value="#{clienteHome.entidade.cpf}"
						disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}"></p:inputMask>
				</h:panelGrid>
			</p:tab>

			<p:tab title="Endereço">

				<p:growl></p:growl>

				<h:panelGrid columns="2">
					<h:outputText value="Logradouro: *" />
					<p:inputText required="true" label="Logradouro" size="70" disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}"
						value="#{clienteHome.entidade.endereco.nomLogradouro}" />
						
						<h:outputText value="Número: *" />
					<p:inputText required="true" label="Número" size="2" disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}"
						value="#{clienteHome.entidade.endereco.numero}" />

					<h:outputText value="CEP: " />
					<p:inputMask mask="99999-999" size="8"
						value="#{clienteHome.entidade.endereco.CEP}"
						disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}"></p:inputMask>


					<h:outputText value="Bairro: " />
					<p:autoComplete required="true" label="Bairro" completeMethod="#{clienteHome.filtrarBairro}" 
					size="35" disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}"
						value="#{clienteHome.entidade.endereco.bairro}" />

					<h:outputText value="Cidade: " />
					<p:autoComplete required="true"
						value="#{clienteHome.entidade.endereco.cidade}" disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}"
						completeMethod="#{clienteHome.filtrarCidade}" size="25" />

					<h:outputText value="UF:  " />
					<p:autoComplete required="true" label="UF" size="5" completeMethod="#{clienteHome.filtrarUF}"
						value="#{clienteHome.entidade.endereco.UF}" disabled="#{!clienteHome.estadoCadastrando and !clienteHome.estadoEditando}" />



				</h:panelGrid>
			</p:tab>
		</p:wizard>
	</h:form>


	<p:dialog id="dglPesquisa" widgetVar="lovPesquisa"
		header="Pesquisar Cliente">
		<h:form id="frmLovPesquisa">
			<p:dataTable value="#{clienteHome.todos}"
				selection="#{clienteHome.entidade}" selectionMode="single"
				var="cliente" dblClickSelect="true"
				rowSelectListener="#{clienteHome.selecionar}"
				onRowSelectComplete="lovPesquisa.hide()" update="frmPagina">

				<p:column headerText="Código" filterBy="#{cliente.id}">
					<h:outputText value="#{cliente.id}" />
				</p:column>
				<p:column headerText="Nome" filterBy="#{cliente.nome}">
					<h:outputText value="#{cliente.nome}" />
				</p:column>
			</p:dataTable>
		</h:form>
	</p:dialog>

</h:body>
</html>